<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="test"></div>
    <script src="../lib/react.development.js"></script>
  <script src="../lib/react-dom.development.js"></script>
  <script src="../lib/babel.min.js"></script>
  <script type="text/babel">
      class MyComponent extends React.Component{
           state={name:'福建省',age:'231'}//可以将state放在构造器外面(添加到类的原型上)
            render(){
                console.log(this)
           return (
               <h2 onClick={this.changeWeather}>你好呀props</h2>
              )
              }
            changeWeather=()=>{//通过赋值和箭头函数的形式可以实现在函数里面访问到实例
             this.height='2313'
             console.log(this)
            }
          }
          //下面是扩展运算符,可以实现对象的深拷贝
      ReactDOM.render(<MyComponent {...prop}/>,document.getElementById('test'))
      let prop={sex:'男',weight:'10kg'}
          let prop2={...prop}//深拷贝
          prop.weight='20kg'
          console.log(prop2)
          let arr=[1,2,3,4,5]
         console.log(arr.reduce((pre,value)=>{
              return pre+value
          }))
        //   function f(value){
        //       return value*2
        //   }
          let arr2=arr.map((value)=>{
              return value*2
          })
          console.log(arr2)
          let arr3=arr2.filter(item=>{
              return item>5
          })
          console.log(arr3)
      </script>
</body>
</html>